<template>
  <a-modal
    :title="title"
    width='98vw'
    :visible="visible"
    :confirmLoading="loading"
    :body-style="{height:'70vh',overflowY:'auto'}"
		:dialogStyle="{top:'20px'}"
		:maskClosable="false"
    :destroyOnClose="true"
     @ok="onOk"
     @cancel="onCancel"
  >
	<a-form-model ref="liForm" :model="form" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="rules">
		<a-tabs default-active-key="1" tab-position="left">
        <a-tab-pane key="1" >
          <span slot="tab">
           基础信息
          </span>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="头像" prop="code" >
          		<div class="clearfix">
          		    <a-upload
          		        name="avatar"
          		        list-type="picture-card"
          		        class="avatar-uploader"
          		        :show-upload-list="false"
          		        :action="imageAction"
          		        :before-upload="beforeUpload"
          		        @change="handleChange"
          		      >
          		        <img v-if="form.imageUrl" :src="form.imageUrl" alt="avatar" :style="{width:'102px',height:'102px'}"/>
          		        <div v-else>
          		          <a-icon :type="loading ? 'loading' : 'plus'" />
          		          <div class="ant-upload-text">
          		            上传头像
          		          </div>
          		        </div>
          		      </a-upload>
          		  </div>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="编号" prop="code" >
          		  <a-input v-model="form.code" placeholder="唯一标识" :disabled="form.id != ''"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="部门" prop="department" >
          			 <a-tree-select
          				:getPopupContainer="selecetPosition"
          				v-model="form.department"
          				 :tree-data="dpttreeData"
          			   />
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="状态" prop="status">
          		  <a-select v-model="form.status" :getPopupContainer="selecetPosition" placeholder="请输入状态">
          			 <a-select-option  v-for="(obj, index) in statusData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          		  </a-select>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-form-model-item label="id" v-show="false">
            <a-input v-model="form.id" />
          </a-form-model-item>
           <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="姓名" prop="name" >
          		  <a-input v-model="form.name" placeholder="请输入姓名" />
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="年龄" prop="age" >
          		  <a-input-number :min="0" v-model="form.age" :style="{width:'100%'}" placeholder="请输入年龄"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="性别" prop="sex">
          			<a-select v-model="form.sex" :getPopupContainer="selecetPosition" placeholder="请输入性别">
          			  <a-select-option :key="0" value="男">男</a-select-option>
          			  <a-select-option :key="1" value="女">女</a-select-option>
          			</a-select>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="生日" prop="birthday">
          		  <a-date-picker v-model="form.birthday" valueFormat="YYYY-MM-DD" placeholder="请输入生日" style="width: 100%;"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="籍贯" prop="nativePlace">
          		  <a-input v-model="form.nativePlace" placeholder="请输入籍贯"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="民族" prop="nation">
          		  <a-select v-model="form.nation" :getPopupContainer="selecetPosition" placeholder="请输入民族">
          			 <a-select-option  v-for="(obj, index) in nationData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          		  </a-select>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="身份证号" prop="idcode" >
          		  <a-input v-model="form.idcode" placeholder="请输入身份证号" />
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="手机号码" prop="mobile" >
          		  <a-input v-model="form.mobile" placeholder="请输入手机号码" />
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="性格" prop="xg" >
          		  <a-input v-model="form.xg" placeholder="请输入性格" />
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="爱好" prop="ah" >
          		  <a-input v-model="form.ah" placeholder="请输入爱好" />
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="不足" prop="bz" >
          		  <a-input v-model="form.bz" placeholder="请输入不足" />
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="挂职情况" prop="gzqk" >
          		  <a-input v-model="form.gzqk" placeholder="请输入挂职情况" />
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="出生地" prop="birthplace">
          		  <a-input v-model="form.birthplace" placeholder="请输入出生地"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="政治面貌" prop="politicsStatus">
          			<a-select v-model="form.politicsStatus" :getPopupContainer="selecetPosition" placeholder="请输入政治面貌">
          			   <a-select-option  v-for="(obj, index) in politicsStatusData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          			</a-select>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="入党时间">
          		  <a-date-picker v-model="form.joinPartyDate" valueFormat="YYYY-MM-DD" placeholder="请输入籍贯" style="width: 100%;"/>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="健康状况" prop="healthCondition">
          		  <a-select v-model="form.healthCondition" :getPopupContainer="selecetPosition" placeholder="请输入健康状况">
          		     <a-select-option  v-for="(obj, index) in healthConditionData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          		  </a-select>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="优秀青年干部类型" prop="youngLeaderType">
          			<a-select v-model="form.youngLeaderType" :getPopupContainer="selecetPosition" placeholder="请输入政治面貌">
          			   <a-select-option  v-for="(obj, index) in youngLeaderTypeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          			</a-select>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="优秀青年干部时间">
          		  <a-date-picker v-model="form.youngLeaderDate" valueFormat="YYYY-MM-DD" placeholder="请输入优秀青年干部时间" style="width: 100%;"/>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="参加工作时间" prop="workDate">
          		   <a-date-picker v-model="form.workDate" valueFormat="YYYY-MM-DD" placeholder="请输入参加工作时间" style="width: 100%;"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="现职务职级" prop="position">
          		  <a-select v-model="form.position" :getPopupContainer="selecetPosition" placeholder="请输入现任职务">
          		     <a-select-option  v-for="(obj, index) in positionData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          		  </a-select>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="职务类别" prop="positionType">
          			<a-select v-model="form.positionType" :getPopupContainer="selecetPosition" placeholder="请输入职务类别">
          			   <a-select-option  v-for="(obj, index) in positionGradeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          			</a-select>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="行政级别" prop="grade">
          			<a-select v-model="form.grade" :getPopupContainer="selecetPosition" placeholder="请输入行政级别">
          			   <a-select-option  v-for="(obj, index) in gradeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          			</a-select>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="拟免职务" prop="removePosition">
          		  <a-select v-model="form.removePosition" :getPopupContainer="selecetPosition" placeholder="请输入拟免职务">
          		     <a-select-option  v-for="(obj, index) in positionData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          		  </a-select>
          		</a-form-model-item>
          	</a-col>
            <a-col class="gutter-row" :span="8">
            	<a-form-model-item label="专业类别" prop="educationType">
            		<a-select v-model="form.educationType" :getPopupContainer="selecetPosition" placeholder="请输入专业类别">
            		   <a-select-option  v-for="(obj, index) in educationTypeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
            		</a-select>
            	</a-form-model-item>
            </a-col>
          </a-row>
          
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="任现职级时间" prop="currentPositionGradeDate">
          		   <a-date-picker v-model="form.currentPositionGradeDate" valueFormat="YYYY-MM-DD" placeholder="请输入任现职级时间" style="width: 100%;"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="培养方向" prop="trainingOrientation">
          		  <a-select v-model="form.trainingOrientation" :getPopupContainer="selecetPosition" placeholder="请输入培养方向">
          		     <a-select-option  v-for="(obj, index) in trainingOrientationData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          		  </a-select>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="培养类别" prop="trainingType">
          			<a-select v-model="form.trainingType" :getPopupContainer="selecetPosition" placeholder="请输入培养类别">
          			   <a-select-option  v-for="(obj, index) in trainingTypeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          			</a-select>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          </a-form-model-item>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          			<a-form-model-item label="任现职时间" prop="rxzsj">
          			   <a-date-picker v-model="form.rxzsj" valueFormat="YYYY-MM-DD" placeholder="请输入任现职时间" style="width: 100%;"/>
          			</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="任现职年限" prop="rxznx">
                <a-input-number :min="0" v-model="form.rxznx" :style="{width:'100%'}" placeholder="请输入任现职年限"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="任现职级年限" prop="rxzjnx">
                 <a-input-number :min="0" v-model="form.rxzjnx" :style="{width:'100%'}" placeholder="请输入任现职级年限"/>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
              <a-form-model-item label="领导类型" prop="leaderType">
                <a-select v-model="form.leaderType" :getPopupContainer="selecetPosition" placeholder="请输入领导类型">
                   <a-select-option  v-for="(obj, index) in leaderTypeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col class="gutter-row" :span="8">
          		<a-form-model-item label="任正副科时间" prop="rzfksj">
          		   <a-date-picker v-model="form.rzfksj" valueFormat="YYYY-MM-DD" placeholder="请输入任正副科时间" style="width: 100%;"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="任正副科年限" prop="rzfknx">
                <a-input-number :min="0" v-model="form.rzfknx" :style="{width:'100%'}" placeholder="请输入任正副科年限"/>
          		</a-form-model-item>
          	</a-col>
          </a-row>
        </a-tab-pane>
        <a-tab-pane key="2" >
          <span slot="tab">
           教育信息
          </span>
          <a-row :gutter="16">
          			 <a-col class="gutter-row" :span="8">
          				<a-form-model-item label="全日制学历" prop="major">
          				  <a-select v-model="form.major" :getPopupContainer="selecetPosition" placeholder="请输入全日制学历">
          				     <a-select-option  v-for="(obj, index) in majorData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          				  </a-select>
          				</a-form-model-item>
          			</a-col>
          			 <a-col class="gutter-row" :span="8">
          				<a-form-model-item label="全日制专业" prop="education">
          				  <a-select v-model="form.education" :getPopupContainer="selecetPosition" placeholder="请输入全日制专业">
          					 <a-select-option  v-for="(obj, index) in educationData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          				  </a-select>
          				</a-form-model-item>
          			</a-col>
          			<a-col class="gutter-row" :span="8">
          				<a-form-model-item label="全日制学位" prop="degree">
          				  <a-select v-model="form.degree" :getPopupContainer="selecetPosition" placeholder="请输入全日制学位">
          					 <a-select-option  v-for="(obj, index) in degreeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          				  </a-select>
          				</a-form-model-item>
          			</a-col>
          </a-row>
          <a-row :gutter="16">
          			 <a-col class="gutter-row" :span="8">
          				<a-form-model-item label="在职学历" prop="onJobMajor">
          				  <a-select v-model="form.onJobMajor" :getPopupContainer="selecetPosition" placeholder="请输入在职学历">
          				     <a-select-option  v-for="(obj, index) in majorData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          				  </a-select>
          				</a-form-model-item>
          			</a-col>
          			 <a-col class="gutter-row" :span="8">
          				<a-form-model-item label="在职专业" prop="onJobEducation">
          				  <a-select v-model="form.onJobEducation" :getPopupContainer="selecetPosition" placeholder="请输入在职专业">
          					 <a-select-option  v-for="(obj, index) in educationData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          				  </a-select>
          				</a-form-model-item>
          			</a-col>
          			<a-col class="gutter-row" :span="8">
          				<a-form-model-item label="在职学位" prop="onJobDegree">
          				  <a-select v-model="form.onJobDegree" :getPopupContainer="selecetPosition" placeholder="请输入在职学位">
          					 <a-select-option  v-for="(obj, index) in degreeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          				  </a-select>
          				</a-form-model-item>
          			</a-col>
          </a-row>
          <a-row :gutter="16">
          			 <a-col class="gutter-row" :span="8">
          				<a-form-model-item label="全日制院校" prop="academy">
          				  <a-input v-model="form.academy" placeholder="请输入全日制院校"/>
          				</a-form-model-item>
          			 </a-col>
          			<a-col class="gutter-row" :span="8">
          				<a-form-model-item label="在职院校" >
          				  <a-input v-model="form.onJobAcademy" placeholder="请输入在职院校"/>
          				</a-form-model-item>
          			</a-col>
          			<a-col class="gutter-row" :span="8">
          				<a-form-model-item label="专业特长" >
          				  <a-input v-model="form.professionalExpertise" placeholder="请输入专业特长"/>
          				</a-form-model-item>
          			</a-col>
          </a-row>
          <a-row :gutter="16">
          			 <a-col class="gutter-row" :span="8">
          			 	<a-form-model-item label="全日制专业大类" prop="educationCategory">
          			 	  <a-select v-model="form.educationCategory" :getPopupContainer="selecetPosition" placeholder="请输入全日制专业大类">
          			 		 <a-select-option  v-for="(obj, index) in educationCategoryData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          			 	  </a-select>
          			 	</a-form-model-item>
          			 </a-col>
          			 <a-col class="gutter-row" :span="8">
          			 	<a-form-model-item label="在职专业大类" prop="onJobEducationCategory">
          			 	  <a-select v-model="form.onJobEducationCategory" :getPopupContainer="selecetPosition" placeholder="请输入在职专业大类">
          			 		 <a-select-option  v-for="(obj, index) in educationCategoryData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          			 	  </a-select>
          			 	</a-form-model-item>
          			 </a-col>
          			 <a-col class="gutter-row" :span="8">
          				<a-form-model-item label="专业技术职称" prop="professionalTitle">
          				  <a-input v-model="form.professionalTitle" placeholder="请输入专业技术职称"/>
          				</a-form-model-item>
          			 </a-col>
          </a-row>
        </a-tab-pane>
        <a-tab-pane key="3" >
          <span slot="tab">
           工作经历
          </span>
          <div class="table-operator">
            <a-button type="primary" icon="plus" @click="handleAddWork">添加</a-button>
          </div>
          <a-table :columns="workcolumns" :data-source="form.workdata" :pagination="false" bordered>
          	<template slot="department" slot-scope="text, record, index">
          		<a-tree-select
          			show-search
          		   :getPopupContainer="selecetPosition"
          			v-model="record.departmentId"
          		    :tree-data="dpttreeData"
          		  />
          	</template>
          	<template slot="position" slot-scope="text, record, index">
          		<a-select v-model="record.position" :getPopupContainer="selecetPosition">
          		   <a-select-option  v-for="(obj, index) in positionData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          		</a-select>
          	</template>
          	<template slot="grade" slot-scope="text, record, index">
          		<a-select v-model="record.grade" :getPopupContainer="selecetPosition">
          		   <a-select-option  v-for="(obj, index) in positionGradeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          		</a-select>
          	</template>
          	<template slot="startDate" slot-scope="text, record, index">
          		<a-date-picker v-model="record.startDate" valueFormat="YYYY-MM-DD"/>
          	</template>
          	<template slot="endDate" slot-scope="text, record, index">
          		<a-date-picker v-model="record.endDate" valueFormat="YYYY-MM-DD"/>
          	</template>
          	<template slot="comment" slot-scope="text, record, index">
          		<a-input v-model="record.comment" />
          	</template>
          	<span slot="workAction" slot-scope="text, record">
          		 <a-popconfirm
          		   title="是否删除该条记录?"
          		   @confirm="handleDel(record,'work')"
          		   @cancel="cancel"
          		   okText="是"
          		   cancelText="否"
          		 >
          		   <a href="#"><a-tag color="blue">删除</a-tag></a>
          		 </a-popconfirm>
          	  </span>
          </a-table>
        </a-tab-pane>
        <a-tab-pane key="4" >
          <span slot="tab">
           家庭情况
          </span>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="详细地址" prop="address" >
          		  <a-input v-model="form.address" placeholder="请输入详细地址" />
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="住房面积" prop="housearea" >
                <a-input-number :min="0" v-model="form.housearea" :style="{width:'100%'}" placeholder="请输入住房面积"/>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="家庭年收入(万元)" prop="jtnsr" >
                <a-input-number :min="0" v-model="form.jtnsr" :style="{width:'100%'}" placeholder="请输入家庭年收入"/>
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-row :gutter="16">
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="是否经营经济实体" prop="isjjst" >
          		  <a-select v-model="form.isjjst" :getPopupContainer="selecetPosition" placeholder="请输入是否经营经济实体">
          		    <a-select-option :key="0" value="是">是</a-select-option>
          		    <a-select-option :key="1" value="否">否</a-select-option>
          		  </a-select>
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="经济实体名称" prop="jjstname" >
          		  <a-input v-model="form.jjstname" placeholder="请输入经济实体名称" />
          		</a-form-model-item>
          	</a-col>
          	<a-col class="gutter-row" :span="8">
          		<a-form-model-item label="经营地点" prop="jydd">
          			 <a-input v-model="form.jydd" placeholder="请输经营地点" />
          		</a-form-model-item>
          	</a-col>
          </a-row>
          <a-divider orientation="left">
                家庭成员
          </a-divider>
          <div class="table-operator">
            <a-button type="primary" icon="plus" @click="handleAddFamily">添加</a-button>
          </div>
          <a-table :columns="familycolumns" :data-source="form.familydata" :pagination="false" bordered>
          			<template slot="name" slot-scope="text, record, index">
          				<a-input v-model="record.name" />
          			</template>
          			<template slot="sex" slot-scope="text, record, index">
          				<a-select v-model="record.sex" :getPopupContainer="selecetPosition" placeholder="请输入性别">
          				  <a-select-option :key="0" value="男">男</a-select-option>
          				  <a-select-option :key="1" value="女">女</a-select-option>
          				</a-select>
          			</template>
          			<template slot="relation" slot-scope="text, record, index">
          				<a-input v-model="record.relation" />
          			</template>
          			<template slot="work" slot-scope="text, record, index">
          				<a-input v-model="record.work" />
          			</template>
          			<span slot="familyAction" slot-scope="text, record">
          				 <a-popconfirm
          				   title="是否删除该条记录?"
          				   @confirm="handleDel(record,'family')"
          				   @cancel="cancel"
          				   okText="是"
          				   cancelText="否"
          				 >
          				   <a href="#"><a-tag color="blue">删除</a-tag></a>
          				 </a-popconfirm>
          			  </span>
          </a-table>
        </a-tab-pane>
        <a-tab-pane key="6" >
          <span slot="tab">
           奖惩信息
          </span>
          <div class="table-operator">
            <a-button type="primary" icon="plus" @click="handleAddRewards">添加</a-button>
          </div>
          <a-table :columns="rewardscolumns" :data-source="form.rewardsdata" :pagination="false" bordered>
          <template slot="type" slot-scope="text, record, index">
          	<a-select v-model="record.type">
          		<a-select-option :key="0" value="奖励">奖励</a-select-option>
          		<a-select-option :key="1" value="惩罚">惩罚</a-select-option>
          	</a-select>
          </template>
          <template slot="comment" slot-scope="text, record, index">
          	<a-input v-model="record.comment" />
          </template>
          <span slot="rewardsAction" slot-scope="text, record">
          	 <a-popconfirm
          	   title="是否删除该条记录?"
          	   @confirm="handleDel(record,'rewards')"
          	   @cancel="cancel"
          	   okText="是"
          	   cancelText="否"
          	 >
          	   <a href="#"><a-tag color="blue">删除</a-tag></a>
          	 </a-popconfirm>
            </span>
          </a-table>
        </a-tab-pane>
        <a-tab-pane key="7" >
          <span slot="tab">
           考核信息
          </span>
          <div class="table-operator">
            <a-button type="primary" icon="plus" @click="handleAddAssess">添加</a-button>
          </div>
          <a-table :columns="assesscolumns" :data-source="form.assessdata" :pagination="false" bordered>
          		  			<template slot="assessType" slot-scope="text, record, index">
          						<a-select v-model="record.assessType" :getPopupContainer="selecetPosition">
          						   <a-select-option  v-for="(obj, index) in assessTypeData" :key="index" :value="obj.name">{{obj.name}}</a-select-option>
          						</a-select>
          		  			</template>
          		  			<template slot="assessDate" slot-scope="text, record, index">
          						<a-date-picker 
          							v-model="record.assessDate" 
          							format="YYYY" 
          							valueFormat="YYYY" 
          							/>
          		  			</template>
          					<template slot="assessDetail" slot-scope="text, record, index">
          						<a-input v-model="record.assessDetail" />
          					</template>
          					<span slot="assessAction" slot-scope="text, record">
          						 <a-popconfirm
          						   title="是否删除该条记录?"
          						   @confirm="handleDel(record,'assess')"
          						   @cancel="cancel"
          						   okText="是"
          						   cancelText="否"
          						 >
          						   <a href="#"><a-tag color="blue">删除</a-tag></a>
          						 </a-popconfirm>
          					  </span>
          </a-table>
        </a-tab-pane>
    </a-tabs> 
		</a-form-model>
  </a-modal>
</template>

<script>
	
function getBase64(img, callback) {
  const reader = new FileReader();
  reader.addEventListener('load', () => callback(reader.result));
  reader.readAsDataURL(img);
}
	
import { getUrl,postAxiosUrl } from '@/api/manage'
import my from '../../../api/my/my'


const workcolumns = [
  {
	title: '工作单位',
	width:'180px',
	dataIndex: 'department',
	scopedSlots: { customRender: 'department' },
  },
  {
  	title: '职务',
	width:'120px',
  	dataIndex: 'position',
  	scopedSlots: { customRender: 'position' },
  },
  {
  	title: '职级',
	width:'120px',
  	dataIndex: 'grade',
  	scopedSlots: { customRender: 'grade' },
  },
  {
  	title: '开始日期',
	width:'150px',
  	dataIndex: 'startDate',
  	scopedSlots: { customRender: 'startDate' },
  },
  {
  	title: '结束日期',
	width:'150px',
  	dataIndex: 'endDate',
  	scopedSlots: { customRender: 'endDate' },
  },
  {
  	title: '备注',
  	dataIndex: 'comment',
  	scopedSlots: { customRender: 'comment' },
  },
  {title: '操作',dataIndex: 'workAction',scopedSlots: { customRender: 'workAction' }}
]
const familycolumns = [
  {
	title: '姓名',
	dataIndex: 'name',
	width:'150px',
	scopedSlots: { customRender: 'name' },
  },
  {
  	title: '性别',
  	dataIndex: 'sex',
	width:'120px',
  	scopedSlots: { customRender: 'sex' },
  },
  {
  	title: '关系',
	width:'120px',
  	dataIndex: 'relation',
  	scopedSlots: { customRender: 'relation' },
  },
  {
  	title: '工作',
  	dataIndex: 'work',
  	scopedSlots: { customRender: 'work' },
  },
  {title: '操作',dataIndex: 'familyAction',scopedSlots: { customRender: 'familyAction' }}
]
const rewardscolumns = [
  {
	title: '类型',
	width:'120px',
	dataIndex: 'type',
	scopedSlots: { customRender: 'type' },
  },
  {
  	title: '备注',
  	dataIndex: 'comment',
  	scopedSlots: { customRender: 'comment' },
  },
  {title: '操作',dataIndex: 'rewardsAction',scopedSlots: { customRender: 'rewardsAction' }}
]

const assesscolumns = [
  {
	title: '考核类型',
	width:'180px',
	dataIndex: 'type',
	scopedSlots: { customRender: 'assessType' },
  },
  {
  	title: '考核日期',
  	dataIndex: 'assessDate',
	width:'150px',
  	scopedSlots: { customRender: 'assessDate' },
  },
  {
  	title: '考核详细',
  	dataIndex: 'assessDetail',
  	scopedSlots: { customRender: 'assessDetail' },
  },
  {title: '操作',dataIndex: 'assessAction',scopedSlots: { customRender: 'assessAction' }}
]
export default {
  components:{
   
  },
  name:"LeaderInfoFrom",
  props: {
    visible: {
      type: Boolean,
      required: true
    },
    model: {
      type: Object,
      default: () => null
    },
    title: {
      type: String,
      default : ''
    }
  },
  data () {
    return {
      imageAction : my.baseURL + "leaderInfo/upload",
      workcolumns,
      workKey : 0,
      familycolumns,
      familyKey : 0,
      rewardscolumns,
      rewardsKey : 0,
      assesscolumns,
      labelCol: { span: 10 },
      wrapperCol: { span:14 },
      dpttreeData : [],
      positionData : [],
      positionGradeData :[],
      politicsStatusData:[],
      trainingTypeData:[],
      trainingOrientationData:[],
      healthConditionData:[],
      youngLeaderTypeData:[],
      leaderTypeData:[],
      assessTypeData:[],
      educationTypeData:[],
      educationCategoryData:[],
      statusData:[],
      gradeData:[],
      majorData:[],
      degreeData:[],
      educationData:[],
      nationData:[],
      selecetPosition : triggerNode => {return triggerNode.parentNode || document.body;},
      form: {
        id:'',
        name: '',
        code:'',
        age: '',
        sex: undefined,
        nation: undefined,
        birthday : '',
        major : undefined,
        education : undefined,
        degree : undefined,
        academy: '',
        nativePlace:'',
        politicsStatus:undefined,
        birthplace:'',
        joinPartyDate:undefined,
        workDate:undefined,
        grade:undefined,
        position:undefined,
        positionType:undefined,
        takePosition:undefined,
        removePosition:undefined,
        currentPositionGradeDate:undefined,
        trainingOrientation:undefined,
        trainingType:undefined,
        department:undefined,
        professionalExpertise:undefined,
        professionalTitle:undefined,
        healthCondition:undefined,
        youngLeaderDate:undefined,
        youngLeaderType:undefined,
        status:undefined,
        isleader:undefined,
        leaderType:undefined,
        onJobEducation:undefined,
        onJobMajor:undefined,
        onJobDegree:undefined,
        onJobAcademy:undefined,
        assessDate:undefined,
        assessDate:undefined,
        assessDetail:undefined,
        educationType:undefined,
        educationCategory:undefined,
        onJobEducationCategory:undefined,
        idcode:undefined,
        mobile:undefined,
        xg:undefined,
        ah:undefined,
        bz:undefined,
        gzqk:undefined,
        address:undefined,
        housearea:undefined,
        isjjst:undefined,
        jjstname :undefined,
        jydd:undefined,
        jtnsr:undefined,
        rxznx:undefined,
        rxzjnx:undefined,
        rzfksj:undefined,
        rzfknx:undefined,
        rxzsj:undefined,
        imageUrl: '',
        workdata:[],
        familydata:[],
        rewardsdata:[],
        assessdata:[]
      },
      loading: false,
      
      rules: {
        code: [
          {required: true, message: '编号不能为空', trigger: 'blur' },
           {
             validator :(rule, value, callback) => {
             if(this.form.id != '') {
                     callback()
                 } else {
                   getUrl('leaderInfo/getbycode',{code:this.form.code}).then(res => {
                     if (res.result) {
                       callback(true)
                     }
                     callback()
                   })
                 }
             },
             message:'编号已经存在',
             trigger: 'blur'
           }
        ],
        name: [
          {required: true, message: '姓名不能为空', trigger: 'blur' },
         
        ],
        age: [
          {required: true, message: '年龄不能为空', trigger: 'blur' },
          
        ],
        sex: [
          {required: true, message: '性别不能为空', trigger: 'blur' },
          
        ],
        nation: [
          {required: true, message: '民族不能为空', trigger: 'blur' },
        ],
        birthday: [
          {required: true, message: '生日不能为空', trigger: 'change' },
        ],
        nativePlace: [
          {required: true, message: '籍贯不能为空', trigger: 'blur' },
        ],
        politicsStatus: [
          {required: true, message: '政治面貌不能为空', trigger: 'change' },
        ],
        birthplace: [
          {required: true, message: '出生地不能为空', trigger: 'blur' },
        ],
        workDate: [
          {required: true, message: '工作时间不能为空', trigger: 'change' },
        ],
        currentPositionGradeDate: [
          {required: true, message: '现任职时间不能为空', trigger: 'change' },
        ],
        department: [
          {required: true, message: '部门不能为空', trigger: 'change' },
        ],
        status: [
          {required: true, message: '状态不能为空', trigger: 'change' },
        ],
        healthCondition: [
          {required: true, message: '状态不能为空', trigger: 'change' },
        ],
        leaderType: [
          {required: true, message: '领导类型不能为空', trigger: 'change' },
        ],
        idcode:[
          {required: true, message: '身份证号不能为空', trigger: 'change' },
          {pattern:/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '身份证号格式不正确', trigger: 'blur'},
          
        ],
        mobile:[
          {required: true, message: '手机号不能为空', trigger: 'change' },
          {pattern:/^(1[34578][0-9]{9})$/, message: '手机号格式不正确', trigger: 'blur'},
        ],
      },
    }
  },
  created () {
    // 当 model 发生改变时，为表单设置值
    this.$watch('model', () => {
      Object.assign(this.form, this.model)
    })
  },
  methods: {
	 handleChange(info) {
	   if (info.file.status === 'uploading') {
		 this.loading = true;
		 return;
	   }
	   if (info.file.status === 'done') {
		 // Get this url from response in real world.
		 getBase64(info.file.originFileObj, imageUrl => {
		   this.form.imageUrl = imageUrl;
		   this.loading = false;
		 });
	   }
	 },
	 beforeUpload(file) {
	   const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
	   if (!isJpgOrPng) {
		 this.$message.error('只能上传JPG!');
	   }
	   const isLt10k = file.size / 1024  < 10;
	   if (!isLt10k) {
		 this.$message.error('头像图片大小不能超过10kb!');
	   }
	   return isJpgOrPng && isLt10k;
	 },
	       
    onCancel() {
       this.$emit("cancel",this)
    },
    onOk() {
	   this.loading = true
       this.$emit("ok",this)
    },
	handleAddWork() {
		const { workdata } = this.form;
		const newData = {
			key : "wd"+ this.form.workdata.length + 1,
			id:'',
			departmentId: '',
			position: '',
			grade: '',
			startDate: '',
			endDate :'',
			comment:''
		  };
		this.form.workdata = [...workdata, newData];
	},
	handleAddFamily() {
		const { familydata } = this.form;
		const newData = {
			key : "fd"+ this.form.familydata.length +1,
			id:'',
			name: '',
			sex: '',
			relation: '',
			work: ''
		  };
		this.form.familydata = [...familydata, newData];
	},
	handleAddRewards() {
		const { rewardsdata } = this.form;
		const newData = {
			key : "rd"+ this.form.rewardsdata.length + 1,
			id:'',
			name: '',
			sex: '',
			relation: '',
			work: ''
		  };
		this.form.rewardsdata = [...rewardsdata, newData];
	},
	handleAddAssess () {
		const { assessdata } = this.form;
		const newData = {
			key : "ad"+ this.form.assessdata.length + 1,
			id:'',
			assessType: '',
			assessDate: '',
			assessDetail: ''
		  };
		this.form.assessdata = [...assessdata, newData];
	},
	cancel(e) {
	},
	handleDel(record,type) {
	 
	  if(type == 'work') {
		  postAxiosUrl('subordinateUnit/delete',{id:record.id}).then(res=>{
			 getUrl('subordinateUnit/list', {leaderInfoId : this.form.id}).then(data => {
				 this.form.workdata = data.result
			 })
		  })
	  }
	  if(type == 'rewards') {
		  postAxiosUrl('rewards/delete',{id:record.id}).then(res=>{
			 getUrl('rewards/list', {leaderInfoId : this.form.id}).then(data => {
				 this.form.rewardsdata = data.result
			 })
		  })
	  }
	  
	  if(type == 'family') {
		  postAxiosUrl('family/delete',{id:record.id}).then(res=>{
		  		getUrl('family/list', {leaderInfoId : this.form.id}).then(data => {
		  		    this.form.familydata = data.result
		  		})
		  })
	  }
	 
	  if(type == 'assess') {
		  postAxiosUrl('assess/delete',{id:record.id}).then(res=>{
			getUrl('assess/list', {leaderInfoId : this.form.id}).then(data => {
				this.form.assessdata = data.result
			})
		  })
	  }
	},
  }
}
</script>
<style lang="less">
  .baseinfo {overflow-y: auto;height: 500px;}
</style>
